<!DOCTYPE html>
<html>
<head>
    <title>处方延伸</title>
    <%- include('../../../_global/baseLibs') %>
    <link src="/static/css/picker/mui.min.css"/>
    <link rel="stylesheet" type="text/css" href="/static/css/picker/mui.picker.min.css" />
    <style>
        body{
            font-size: 1rem;
        }
        .no-data-box{
            overflow: hidden;
        }
        .wxts-box{
            position: absolute;
            bottom: 0rem;
            height: 8.5rem;
            padding: 0.8rem;
            background-color: #ffffff;
        }
        .wxts-span{
            color: #FF4C4D;
            font-size: 14px;
        }
        .wxts-note{
            color: #999999;
            font-size: 12px;
        }
        .img-box{
            text-align: center;
            margin-top: 5.7rem;
        }
        .no-data-box img{
            height: 8rem;
            width: 11.6rem;
        }
        .img-box div{
            line-height: 4rem;
            color: #999999;
            font-size: 14px
        }
    </style>
    <style>
        .yscf-item-box{
            height: 12rem;
            background: #FFFFFF;
            padding-top: 0.5rem;
            border-top: 1px solid #ddd;
        }
        .yscf-info-box{
            height: 75%;
        }
        .yscf-info-box div{
            font-size: 14px;
            padding: 0.4rem 0rem 0rem 1rem;
        }
        .yscf-info-box label{
            color: #ADADAD;
            letter-spacing: 0;
            display: inline-block;
            width: 5.5rem;
        }
        .yscf-btn{
            position: relative;
            height: 25%;
            vertical-align: middle;
            border-top: 1px dashed #C8C8C8;
        }
        .yscf-btn a{
            font-size: 12px;
            line-height: 1.2rem;
            color: #FC9400;
            border-radius: 5rem;
            border: 0.1rem solid;
            position: relative;
            float: right;
            padding: 0.4rem 0.9rem 0.2rem 0.9rem;
            top: 0.4rem;
            right: 1.5rem;
        }
        .btn{
            background-color: #02af6d;
            color: #fff;
            border: 0;
            width: 50%;
            float: left;padding:0.5rem;
        }
    </style>
    <script>
        var page_cfys_index = (function($, page_cfys_index) {

            var cfg_def = {

            }
            page_cfys_index.init = function(cfg){
                initView();
            }

            function initView(){
                $("body").on('click', '.yscf-btn a', function(){
                    var obj = {
                        yljg : $(this).attr('data-yljgbm'),
                        cfh: $(this).attr('data-cfh')
                    }
                    sessionStorage.setItem('cfInfo',JSON.stringify(obj))
                    $.pageSwitch.goToUrl('yscf', 'detail');
                })
            }
            return page_cfys_index;
        })(jQuery, {})
    </script>
</head>
<body>
<div class="no-data-box" style="display: none">
    <div class="img-box">
        <img src="/static/images/qyfw/find-none.png">
        <div>
            <span>暂无数据</span>
        </div>
    </div>
    <div class="wxts-box">
        <div>
            <span class="wxts-span">*温馨提示：</span>
        </div>
        <span class="wxts-note">您可以在本街道（乡镇）社区卫生服务中心范围内，根据自身意愿选择签约。一个签约周期原则上不小于1年，可以解约，也可以自动续约</span>
    </div>
</div>
<button data-options='{"type":"date"}' style="border-right: 1px solid #fff;" class="btn mui-btn mui-btn-block">选择开始日期</button>
<button data-options='{"type":"date"}' class="btn mui-btn mui-btn-block">选择结束日期</button>
<button id="find" class="mui-btn mui-btn-block" style = "background-color: #02af6d;color: #fff;border: 0;width: 100%;border-top: 1px solid #fff;padding:0.5rem;">查询</button>
<ul id="contain"></ul>
</body>
<script src="/static/js/picker/mui.min.js"></script>
<script src="/static/js/picker/mui.picker.min.js"></script>
<script>

    $(function () {
        var userInfo = JSON.parse(localStorage.getItem('jkcsUserInfo'))
        var times = new Date();
        var beginDate = (times.getFullYear()-1)+addZero(times.getMonth()+1)+addZero(times.getDate()),endDate = times.getFullYear()+addZero(times.getMonth()+1)+addZero(times.getDate());
        function addZero(e) {
            return (e<10)? '0'+e:e;
        }
        var obj = {
            idcard : userInfo.sfzh,
            cfsjstart: beginDate,
            cfsjend : endDate
        }
        cardId()
        $("#find").on('click',function () {
            if(endDate && beginDate){
                $("#contain").html(' ');
                queryCF(obj)
            }else {
                $.QuickAlert.alertFail({content:'请选择日期'})
            }
        })
        function queryCF(obj) {
            $.QuickRemote.AjaxJson({
                funcName: "/api/gzd/shbus/queryCF"
                ,params: obj
                ,callback: function(result) {
                    var html = ''
                    for(var i =0;i<result.length;i++){
                        var cf = result[i]
                        var shfs = (result[i].shfs == 1)? '自提': '送货上门'
                        html += '<li class="yscf-item-box">\n' +
                            '        <div class="yscf-info-box">\n' +
                            '            <div>\n' +
                            '                <label>开方日期</label>\n' +
                            '                <span>'+cf.kfrq+'</span>\n' +
                            '            </div>\n' +
                            '            <div>\n' +
                            '                <label>处方号</label>\n' +
                            '                <span>'+cf.cfh+'</span>\n' +
                            '            </div>\n' +
                            '            <div>\n' +
                            '                <label>送货方式</label>\n' +
                            '                <span>'+shfs+'</span>\n' +
                            '            </div>\n' +
                            '            <div>\n' +
                            '                <label>送货地址</label>\n' +
                            '                <span>'+cf.hzshdz+'</span>\n' +
                            '            </div>\n' +
                            '        </div>\n' +
                            '        <div class="yscf-btn">\n' +
                            '            <a data-yljgbm='+cf.yljgdm+' data-cfh='+cf.cfh+'>查看物流</a>\n' +
                            '        </div>\n' +
                            '    </li>'
                    }
                    $("#contain").append(html);
                }
            });
        }
        //获取就诊卡号
        function cardId() {
            $.QuickRemote.AjaxJson({
                funcName: "/api/gzd/yygh/getJzrInfo"
                ,callback: function(result) {
                    if(result.mrjzk){
                        if(result.mrjzk.jzklx == 0){
                            obj.sbkh = result.mrjzk.jzkh;
                        }else if(result.mrjzk.jzklx == 1){
                            obj.ybkh = result.mrjzk.jzkh;
                        }
                        queryCF(obj)
                    }else {
                        $.QuickAlert.alertFail({content:'请先设置默认就诊卡信息'});
                        return
                    }
                }
            });
        }

            var result = $('#result');
            var result1 = $('#result1');
            var btns = $('.btn');
            btns.each(function(i, btn) {
                btn.addEventListener('tap', function() {
                    var _self = this;
                    if(_self.picker) {
                        _self.picker.show(function (rs) {
                            result.innerText = '选择结果: ' + rs.text;
                            _self.picker.dispose();
                            _self.picker = null;
                        });
                    } else {
                        var nowDate = new Date();
                        var optionsJson = this.getAttribute('data-options') || '{"value":'+nowDate+'}';
                        var options = JSON.parse(optionsJson);
                        options.beginYear = '2010'
                        options.endYear = nowDate.getFullYear()
                        _self.picker = new mui.DtPicker(options);
                        _self.picker.show(function(rs) {
                            var time = rs.y.text+rs.m.text+rs.d.text;
                            (i==0)?beginDate = time:endDate = time;
                            if(endDate && endDate<beginDate){
                                $.QuickAlert.alertFail({content:'结束时间小于开始时间，请重新选择'});
                                endDate = '';
                                return
                            }
                            btns[i].innerText = time;
                            _self.picker.dispose();
                            _self.picker = null;
                            return (i==0)? obj.cfsjstart = time: obj.cfsjend = time;
                        });
                    }
                }, false);
            });
    })
</script>
</html>